<script lang="ts" setup>
  // 接收外部传入的数据
  // withDefaults vue3提供技术  给props设置默认值
  const props = withDefaults(
    defineProps<{
      type?: number
    }>(),
    {
      type: 31,
    }
  )
</script>

<template>
  <!-- 普通通知（31） -->
  <view class="message-tips">
    <view class="wrapper">医护人员正在赶来，请耐心等候</view>
  </view>

  <!-- 温馨提示（32） -->
  <view class="message-tips">
    <view class="wrapper">
      <text class="label" v-if="type === 32">温馨提示:</text>
      <slot />
    </view>
  </view>
</template>

<style lang="scss">
  .message-tips {
    display: flex;
    justify-content: center;
    margin-top: 60rpx;

    &:first-child {
      margin-top: 30rpx;
    }
  }

  .wrapper {
    line-height: 1;
    text-align: center;
    padding: 20rpx 30rpx;
    // margin-top: 60rpx;
    font-size: 24rpx;
    border-radius: 70rpx;
    color: #848484;
    background-color: #fff;

    .label {
      color: #16c2a3;
    }
  }
</style>
